<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    <script>
        // 作用域： 变量或者函数的作用范围 
        // 作用域 js里分2种  ：1.全局作用域 2.局部作用域（函数作用域）

        // 全局作用域 直接定义的一些变量和函数 
        // 全局范围
        // var a = 10;
        // var b = 20;
        // function fn(){
        //     console.log(1111);
        // }

        // 局部作用域（函数作用域）;
        // function fn(){
        //     // 函数大括号里包裹的区域就是局部作用域
        //     var a = 10;
        //     var b = 20;
        //     console.log(a,b);
        // }


        // function fn2(){
        //     var c = 30;
        //     var d = 40;
        //     // console.log(a,b);
        // }

        // fn();
        // fn2();


        // console.log(a,b);

        // 通过自执行函数创建局部作用域
        // (function(){
        //     var a = 10;
        // })();
        // (function(){
        //     var b = 20;
        //     console.log(a);

        // })();

        // 不是局部作用域  是全局作用域
        // if(true){
        //     var a = 10;
        // }

        // console.log(a);

        // 局部作用域的访问规则 
        // 注意：局部作用域可以访问 上层作用域里的内容 ，但是不能访问下层里的内容
        var a = 20;
        function fn(){
            // 全局作用域----》fn函数作用域 -----》 fn2函数作用域
            // console.log(a);
            var b = 30;
            function fn2(){
                // console.log(a,b);
                var c = 100;
            }
            fn2();
        }

        fn();
        // console.log(c);

    </script>
</body>
</html>